import React from 'react';
import { BasicPanelItem, BuildPanelEventContext, PanelProps } from 'amis-editor';
import { Icon } from 'amis';
import LeftTabs from './Tabs';

class TabPanel extends React.Component<PanelProps, any> {
  render() {
    const { store, manager } = this.props;
    return <LeftTabs store={store} manager={manager} type="portal" />;
  }
}

function buildEditorPanel(
  context: BuildPanelEventContext,
  panels: Array<BasicPanelItem>,
) {
  // 多选时不显示
  if (context.selections.length) {
    return;
  }

  panels.push({
    key: 'renderers',
    icon: 'png-icon renderers-png',
    title: (
      <span className="editor-tab-icon" editor-tooltip="容器及组件">
        <Icon icon="editor-renderer" />
      </span>
    ),
    component: TabPanel,
    position: 'left',
    order: -9999,
  });
}
export { buildEditorPanel as PortalEditPanel };
